<!--
 * @Author: thinkido 4077725@qq.com
 * @Date: 2022-07-07 18:59:49
 * @LastEditors: thinkido 4077725@qq.com
 * @LastEditTime: 2022-07-11 21:02:13
 * @FilePath: \vue3vite-framework\src\App.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->


<template>
  <div id="app">
    <!-- 菜单栏 -->
    <van-nav-bar v-if="showBack" left-text="返回" fixed left-arrow @click-left="onClickLeft" :title="title" />
    <router-view></router-view>
    <!-- 导航栏 -->
    <t-menu v-if="showMenu"></t-menu>
  </div>
</template>


<script>

import { computed, ref, getCurrentInstance } from "vue";
import { useStore } from "vuex";
import { useRouter } from 'vue-router'
import router from "./router";

export default {
  name: 'App',
  components:{
    
  },
  setup(props, context) {
    const { attrs, emit, slots } = context;
    const currentInstance = getCurrentInstance();

    const { ctx } = currentInstance;
    

    const active = ref(0);
    const store = useStore();
    const router = useRouter();

    const title = computed(() => store.state.title);
    const backPath = computed(() => store.state.backPath);
    const showBack = computed(() => store.state.showBack);
    const showMenu = computed(() => store.state.showMenu);
    
    // ctx.$eventBus.$on(
    //   "testEvt",
    //   data => {
    //     console.log('app eventBus:' ,data )
    //   },
    //   currentInstance
    // );
    const onClickLeft = () => {
      console.log('onclickback:', backPath.value)
      if(!backPath.value) return history.back();
      router.push(backPath.value)
    }
    return {
      onClickLeft,title,backPath,showBack,showMenu,
    };
  },
  created() {
    console.log('app created:' ,this.$eventBus )
  },
  mounted() {
    console.log('app mounted' , this)
    this.$eventBus.on('testEvt',data=>{
      console.log('app eventBus on:' ,data )
    })
  },
}
</script>

<style>

</style>

